w<template>
	<view>
		<view class="content">
			<view v-for="(item, index) in details" :key="index" class="content_a" @click="erji_shijian">
				<view class="content_b"><image :src="item.icon" mode="aspectFill"></image></view>
				<text style="margin-top: 10rpx;">{{ item.name }}</text>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {};
	},
	props: {
		details: {
			type: Array,
			default: null,
		},
	},
	onLoad() {
		
	},
	methods: {
		erji_shijian() {},
	},
};
</script>

<style lang="scss" scoped>
.content {
	display: flex;
	flex-flow: row;
	justify-content: space-around;
	.content_a {
		height: 180rpx;
		display: flex;
		flex-flow: column;
		justify-content: center;
		align-items: center;
		.content_b {
			width: 104rpx;
			height: 104rpx;
			background: pink;
			border-radius: 20rpx 20rpx 20rpx 20rpx;
			overflow: hidden;
			image {
				width: 100%;
				height: 100%;
			}
		}
		// .content_c{
		// 	margin-bottom: 18rpx;
		// 	image{
		// 		width: 100%;
		// 		height: 100%;
		// 	}
		// }
		text {
			font-size: 22rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #999999;
		}
	}
}
</style>
